/* Main positioning */

nav{

    position: relative;
    cursor: default;
    z-index: 4;
    border-radius: 6px 6px 0 0;
    font-family: 'Open Sans', sans-serif;
}

nav>ul>li{
    float: left;
    position: relative;

    background: #777777;
    background: -moz-linear-gradient(top, #777777 0%, #505050 100%); 
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#777777), color-stop(100%,#505050));  
    background: -webkit-linear-gradient(top, #777777 0%,#505050 100%);
    background: -o-linear-gradient(top, #777777 0%,#505050 100%); 
    background: -ms-linear-gradient(top, #777777 0%,#505050 100%);
    background: linear-gradient(to bottom, #777777 0%,#505050 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#777777', endColorstr='#505050',GradientType=0 );
}

nav>ul>li>a{
    border-right: 1px solid rgba(0, 0, 0, 0.33);
    color: #F0F0F0;
    font-size: 14px;
    font-weight: 400;
    padding: 9px 16px;
    text-shadow: 1px 1px rgba(0, 0, 0, .33);
    position: relative;
    z-index: 510;
    line-height: 20px;
}

nav>ul>li>a:hover{color: #FFF}
nav>ul>li>a:focus{color: #FFF}

/* Main fixes */

nav>ul>li:first-child a{
    padding: 10px 13px 12px;
    line-height: 16px;
}
nav>ul>li:first-child a>img{display: inline-block}

nav>ul>li:last-child>a{
    padding: 9px 23px 9px 23px;
    border-right: 0
}
nav>ul>li:last-child,
nav>ul>li:last-child>span{
    border-radius: 0 6px 0 0 
}
nav>ul>li:first-child{
    /*display: none*/
}

/* Active state */

nav>ul>li.active{
    background: #f9f9f9;
    color: #545454;
    text-shadow: 1px 1px rgba(255, 255, 255, 0.33);
    /*transition: all 0.1s linear 0s;*/
    background: url("../img/active-gradient.jpg") repeat-x scroll 0 0 transparent;
}

nav>ul>li.active:first-child>span{
    display: none
}

nav>ul>li:first-child.active{border-radius: 6px 0 0; padding-left: 1px}
nav>ul>li:first-child.active a{border-right: 0; }

/* Fake span bg */

nav>ul>li>span{
    width: 100%;
    height: 100%;
    background: #414141;
    position: absolute;
    top: 0;
    bottom: 0;

    opacity: 0;
    visibility: hidden;

    -webkit-transition: all .3s ease .15s;
    -moz-transition: all .3s ease .15s;
    -o-transition: all .3s ease .15s;
    -ms-transition: all .3s ease .15s;
    transition: all .3s ease .15s;

}

nav>ul>li:hover span{

    opacity: 1;
    visibility: visible;
    overflow: visible;

}

/* Mega menu styles */

nav>ul>li>div{
    position: absolute;
    width: 443px;
    top: 38px;
    left: 0;
    background: #FFF;
    box-shadow: 0 3px 3px rgba(0, 0, 0, .33);
    border: 1px solid #414141;
    border-top:0;
    border-radius: 0 0 6px 6px;

    opacity: 0;
    visibility: hidden;


    -webkit-transition: all .3s ease .15s;
    -moz-transition: all .3s ease .15s;
    -o-transition: all .3s ease .15s;
    -ms-transition: all .3s ease .15s;
    transition: all .3s ease .15s;

    padding: 9px 16px
}
nav>ul>li>div .row{
    margin: 10px 0 0 10px;
    position: relative;
    float: left
}

nav>ul>li>div .row:nth-child(2),
nav>ul>li>div .row:nth-child(6),
nav>ul>li>div .row:nth-child(10)
{margin-left: 0}
nav>ul>li>div>h3{
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    font-family: 'Open Sans Condensed',sans-serif;
    font-size: 23px;
    font-weight: 600;
    margin: 10px 0 2px;
    padding-bottom: 2px;
    color: #0A0A0A;
}
nav>ul>li>div h5{
    font-size: 13px;
    margin: 0;
    font-weight: normal;
    line-height: 16px;
}
nav>ul>li>div img{
    border-radius: 3px
}

nav>ul>li:hover > div {
    opacity: 1;
    visibility: visible;
    overflow: visible;
}